@import url("./nav.css");
@import url("./footer.css");

*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}

html,
body{
    height: 100%;
    width: 100%;
}

.sclmcontainer{
    /* border: 1px solid red; */
    padding-top:92px;
    padding-bottom:92px;
    background-color: #47474717;
    box-shadow: 1px 1px 10px 1px gray;
    margin-bottom: 10px;
}

.slide1{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}



#toggleBtn1{
    width:1200px;
    height: max-content;
    font-size: 25px;
    color: #002147;
    font-weight: bold;
    border: none;
    background-color: #fdc800;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content:space-between;
    padding:15px;

}

#toggleBtn1:hover{
    cursor: pointer;
}

#iconl{
    transition: all 0.5s;
}



#panel1{
    display: none;
    background-color: lightgray;
    width: 1200px;
    height:max-content;
    padding: 10px;
}

#panel1 table{
    display: table;
    width: 80%;
    height: 400px;
    text-align: center;
    margin: auto;    
    border-collapse: collapse;
    font-weight: 700;
}

#panel1 table tr{
    padding: 30px;
}

#panel1 table tr:nth-child(1){
    background-color: #002147;
    color:white
}

.rotate{
    transform: rotate(136deg);
}

/* Middle School Slide  */

.slide2{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin-top:3px;
}

#toggleBtn2{
    width:1200px;
    height: max-content;
    font-size: 25px;
    color: #002147;
    font-weight: bold;
    border: none;
    background-color: #fdc800;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content:space-between;
    padding:15px;

}

#toggleBtn2:hover{
    cursor: pointer;
}

#icon2{
    transition: all 0.5s;
}



#panel2{
    display: none;
    background-color: lightgray;
    width: 1200px;
    height:max-content;
    padding: 10px;
}

#panel2 table{
    display: table;
    width: 80%;
    height: 400px;
    text-align: center;
    margin: auto;    
    border-collapse: collapse;
    font-weight: 700;
}

#panel2 table tr{
    padding: 30px;
}

#panel2 table tr:nth-child(1){
    background-color: #002147;
    color:white
}

/* High School Slide */

.slide3{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin-top:3px;
}

#toggleBtn3{
    width:1200px;
    height: max-content;
    font-size: 25px;
    color: #002147;
    font-weight: bold;
    border: none;
    background-color: #fdc800;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content:space-between;
    padding:15px;

}

#toggleBtn3:hover{
    cursor: pointer;
}

#icon3{
    transition: all 0.5s;
}



#panel3{
    display: none;
    background-color: lightgray;
    width: 1200px;
    height:max-content;
    padding: 10px;
}

#panel3 table{
    display: table;
    width: 80%;
    height: 400px;
    text-align: center;
    margin: auto;    
    border-collapse: collapse;
    font-weight: 700;
}

#panel3 table tr{
    padding: 30px;
}

#panel3 table tr:nth-child(1){
    background-color: #002147;
    color:white
}

/* Princiapl List slider */

.slide4{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin-top:3px;
}

#toggleBtn4{
    width:1200px;
    height: max-content;
    font-size: 25px;
    color: #002147;
    font-weight: bold;
    border: none;
    background-color: #fdc800;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content:space-between;
    padding:15px;

}

#toggleBtn4:hover{
    cursor: pointer;
}

#icon4{
    transition: all 0.5s;
}



#panel4{
    display: none;
    background-color: lightgray;
    width: 1200px;
    height:max-content;
    padding: 10px;
}

#panel4 table{
    display: table;
    width: 80%;
    height:600px;
    text-align: center;
    margin: auto;    
    border-collapse: collapse;
    font-weight: 700;
}

#panel4 table tr{
    padding: 30px;
}

#panel4 table tr:nth-child(1){
    background-color: #002147;
    color:white
}